//
//  NavigetionViewStudy.swift
//  NaiCha
//
//  Created by 唐安坤 on 2024/9/9.
//

import SwiftUI

struct FixBug_NavigetionViewStudy: View {
    
    @ObservedObject fileprivate var dogModel = MyModel()
    
    var body: some View {
        List {
            
            ForEach(dogModel.dataArr) { model in
                
                Section(isExpanded: Binding(get: {
                    model.isExpanded
                }, set: {
                    model.isExpanded = $0
                })) {
                    ForEach(model.arr){m in
                        DogCardView(image: m.image, name: m.dogName)
                    }
                    
                } header: {
                    
                    HStack{
                        Text(model.SectionName)
                        Spacer()
                        Button(action: {
                            model.isExpanded = !model.isExpanded
                            print("-------",model.isExpanded)
                        }, label: {
                            let str = model.isExpanded ? "收起" : "展开"
                            Text(str)
                            Image(systemName: "heart.fill").foregroundStyle(.yellow)
                        })
                    }.background(.red.opacity(0.2))
                        .clipShape(RoundedRectangle(cornerRadius: 5))
                }
            }
        }
        .listStyle(.plain)
        .foregroundColor(.blue)
        
    }
}

fileprivate class MyModel: ObservableObject{
   @Published var dataArr = [
       DogArrModel(SectionName: "汪汪1组",
                   arr: [ DogModel.init(image: "dog01", dogName: "汪汪01"),
                          DogModel.init(image: "dog02", dogName: "汪汪02"),
                          DogModel.init(image: "dog03", dogName: "汪汪03")]),
       DogArrModel(SectionName: "汪汪2组",
                   arr: [ DogModel.init(image: "dog04", dogName: "汪汪04"),
                          DogModel.init(image: "dog05", dogName: "汪汪05"),
                          DogModel.init(image: "dog06", dogName: "汪汪06")])
   ]
}

fileprivate class DogArrModel: ObservableObject,Identifiable{
    var id: UUID = UUID()
    var SectionName:String = ""
    var arr:[DogModel] = []
    @Published var isExpanded:Bool = true
    init(SectionName: String, arr: [DogModel]) {
        self.SectionName = SectionName
        self.arr = arr
    }
}

fileprivate struct DogModel: Identifiable{
    var id: UUID = UUID()
    var image:String
    var dogName: String
    
}

#Preview {
    FixBug_NavigetionViewStudy()
}

fileprivate struct DogCardView: View {
    var image: String
    var name: String
    var body: some View {
        
        VStack{
            HStack {
                Text(name).font(.system(size: 30,weight: .bold))
                
                Spacer()
            }
            VStack{
                Image(image, bundle: nil)
                    .resizable()
                    .aspectRatio(contentMode: .fill)
                    .frame(height: 200)
                
                    .clipShape(RoundedRectangle(cornerRadius: 15))
            }
            
            
            HStack(alignment:.bottom){
                HStack {
                    Image(systemName: "heart.fill").foregroundColor(.pink).font(.system(size: 12))
                    Text("3.2K").foregroundColor(.pink).font(.system(size: 12))
                }
                .padding(EdgeInsets(top: 3, leading: 3, bottom: 3, trailing: 3))
                .background(.pink.opacity(0.3))
                .clipShape(RoundedRectangle(cornerSize: CGSize(width: 3, height: 3)))
                HStack {
                    Image(systemName: "heart.fill").foregroundColor(.blue).font(.system(size: 12))
                    Text("3.2K").foregroundColor(.blue).font(.system(size: 12))
                }
                .padding(EdgeInsets(top: 3, leading: 3, bottom: 3, trailing: 3))
                .background(.blue.opacity(0.3))
                .clipShape(RoundedRectangle(cornerSize: CGSize(width: 3, height: 3)))
                Spacer()
                
                Text("$").font(.system(size: 20)).foregroundColor(.pink)
                Text("5999").font(.system(size: 20)).foregroundColor(.pink)
            }.padding(.top)
            
            
        }
        .listRowSeparator(.hidden)
        .padding()
        .background(.white)
        .clipShape(RoundedRectangle(cornerSize: CGSize(width: 10, height: 10)))
        .shadow(color: .gray, radius: 5, x: 0.0, y: 5)
    }
}
